<!DOCTYPE html>



  


<html class="theme-next pisces use-motion" lang="zh-Hans">
<head><meta name="generator" content="Hexo 3.9.0">
  <meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="theme-color" content="#222">









<meta http-equiv="Cache-Control" content="no-transform">
<meta http-equiv="Cache-Control" content="no-siteapp">
















  
  
  <link href="/lib/fancybox/source/jquery.fancybox.css?v=2.1.5" rel="stylesheet" type="text/css">







<link href="/lib/font-awesome/css/font-awesome.min.css?v=4.6.2" rel="stylesheet" type="text/css">

<link href="/css/main.css?v=5.1.4" rel="stylesheet" type="text/css">


  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon-next.png?v=5.1.4">


  <link rel="icon" type="image/png" sizes="32x32" href="/images/favicon-32.png?v=5.1.4">


  <link rel="icon" type="image/png" sizes="16x16" href="/images/favicon-16.png?v=5.1.4">


  <link rel="mask-icon" href="/images/logo.svg?v=5.1.4" color="#222">





  <meta name="keywords" content="Hexo, NexT">










<meta name="description" content="扩展运算符（...）将数组变为参数序列 1console.log(...[1,2,3]); // 1,2,3 代替apply12345678// ES5 的写法Math.max.apply(null, [14, 3, 77])// ES6 的写法Math.max(...[14, 3, 77])// 等同于Math.max(14, 3, 77); 替换push123456789// ES5的 写法v">
<meta property="og:type" content="article">
<meta property="og:title" content="JavaScript之Array数组">
<meta property="og:url" content="http://yoursite.com/2020/06/08/JavaScript之Array数组/index.html">
<meta property="og:site_name" content="春风自是人间客">
<meta property="og:description" content="扩展运算符（...）将数组变为参数序列 1console.log(...[1,2,3]); // 1,2,3 代替apply12345678// ES5 的写法Math.max.apply(null, [14, 3, 77])// ES6 的写法Math.max(...[14, 3, 77])// 等同于Math.max(14, 3, 77); 替换push123456789// ES5的 写法v">
<meta property="og:locale" content="zh-Hans">
<meta property="og:image" content="https://wx2.sinaimg.cn/mw690/0069qZtTgy1ghdl1udru0j309o068dfy.jpg">
<meta property="og:updated_time" content="2020-12-08T13:25:25.755Z">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="JavaScript之Array数组">
<meta name="twitter:description" content="扩展运算符（...）将数组变为参数序列 1console.log(...[1,2,3]); // 1,2,3 代替apply12345678// ES5 的写法Math.max.apply(null, [14, 3, 77])// ES6 的写法Math.max(...[14, 3, 77])// 等同于Math.max(14, 3, 77); 替换push123456789// ES5的 写法v">
<meta name="twitter:image" content="https://wx2.sinaimg.cn/mw690/0069qZtTgy1ghdl1udru0j309o068dfy.jpg">



<script type="text/javascript" id="hexo.configurations">
  var NexT = window.NexT || {};
  var CONFIG = {
    root: '/',
    scheme: 'Pisces',
    version: '5.1.4',
    sidebar: {"position":"left","display":"post","offset":12,"b2t":false,"scrollpercent":false,"onmobile":false},
    fancybox: true,
    tabs: true,
    motion: {"enable":true,"async":false,"transition":{"post_block":"fadeIn","post_header":"slideDownIn","post_body":"slideDownIn","coll_header":"slideLeftIn","sidebar":"slideUpIn"}},
    duoshuo: {
      userId: '0',
      author: '博主'
    },
    algolia: {
      applicationID: '',
      apiKey: '',
      indexName: '',
      hits: "",
      labels: ""
    }
  };
</script>



  <link rel="canonical" href="http://yoursite.com/2020/06/08/JavaScript之Array数组/">





  <title>JavaScript之Array数组 | 春风自是人间客</title>
  








</head>

<body itemscope itemtype="http://schema.org/WebPage" lang="zh-Hans">

  
  
    
  

  <div class="container sidebar-position-left page-post-detail">
    <div class="headband"></div>

    <header id="header" class="header" itemscope itemtype="http://schema.org/WPHeader">
      <div class="header-inner"><div class="site-brand-wrapper">
  <div class="site-meta ">
    

    <div class="custom-logo-site-title">
      <a href="/" class="brand" rel="start">
        <span class="logo-line-before"><i></i></span>
        <span class="site-title">春风自是人间客</span>
        <span class="logo-line-after"><i></i></span>
      </a>
    </div>
      
        <h1 class="site-subtitle" itemprop="description">是非成败转头空，青山依旧在，几度夕阳红。</h1>
      
  </div>

  <div class="site-nav-toggle">
    <button>
      <span class="btn-bar"></span>
      <span class="btn-bar"></span>
      <span class="btn-bar"></span>
    </button>
  </div>
</div>

<nav class="site-nav">
  

  
    <ul id="menu" class="menu">
      
        
        <li class="menu-item menu-item-home">
          <a href="/" rel="section">
            
            首页
          </a>
        </li>
      
        
        <li class="menu-item menu-item-archives">
          <a href="/archives" rel="section">
            
            归档
          </a>
        </li>
      
        
        <li class="menu-item menu-item-categories">
          <a href="/categories" rel="section">
            
            分类
          </a>
        </li>
      
        
        <li class="menu-item menu-item-program">
          <a href="/categories/program" rel="section">
            
            程序
          </a>
        </li>
      
        
        <li class="menu-item menu-item-reading">
          <a href="/categories/reading" rel="section">
            
            阅读
          </a>
        </li>
      
        
        <li class="menu-item menu-item-idea">
          <a href="/categories/idea" rel="section">
            
            想法
          </a>
        </li>
      
        
        <li class="menu-item menu-item-tags">
          <a href="/tags" rel="section">
            
            标签
          </a>
        </li>
      
        
        <li class="menu-item menu-item-about">
          <a href="/about" rel="section">
            
            关于我
          </a>
        </li>
      

      
    </ul>
  

  
</nav>



 </div>
    </header>

    <main id="main" class="main">
      <div class="main-inner">
        <div class="content-wrap">
          <div id="content" class="content">
            

  <div id="posts" class="posts-expand">
    

  

  
  
  

  <article class="post post-type-normal" itemscope itemtype="http://schema.org/Article">
  
  
  
  <div class="post-block">
    <link itemprop="mainEntityOfPage" href="http://yoursite.com/2020/06/08/JavaScript之Array数组/">

    <span hidden itemprop="author" itemscope itemtype="http://schema.org/Person">
      <meta itemprop="name" content="彭丹丹">
      <meta itemprop="description" content>
      <meta itemprop="image" content="https://upload.jianshu.io/users/upload_avatars/830956/debe5156eed7?imageMogr2/auto-orient/strip|imageView2/1/w/240/h/240">
    </span>

    <span hidden itemprop="publisher" itemscope itemtype="http://schema.org/Organization">
      <meta itemprop="name" content="春风自是人间客">
    </span>

    
      <header class="post-header">

        
        
          <h2 class="post-title" itemprop="name headline">JavaScript之Array数组</h2>
        

        <div class="post-meta">
          <span class="post-time">
            
              <span class="post-meta-item-icon">
                <i class="fa fa-calendar-o"></i>
              </span>
              
                <span class="post-meta-item-text">发表于</span>
              
              <time title="创建于" itemprop="dateCreated datePublished" datetime="2020-06-08T15:44:34+08:00">
                2020-06-08
              </time>
            

            

            
          </span>

          
            <span class="post-category">
            
              <span class="post-meta-divider">|</span>
            
              <span class="post-meta-item-icon">
                <i class="fa fa-folder-o"></i>
              </span>
              
                <span class="post-meta-item-text">分类于</span>
              
              
                <span itemprop="about" itemscope itemtype="http://schema.org/Thing">
                  <a href="/categories/program/" itemprop="url" rel="index">
                    <span itemprop="name">program</span>
                  </a>
                </span>

                
                
              
            </span>
          

          
            
          

          
          

          

          
            <div class="post-wordcount">
              
                
                <span class="post-meta-item-icon">
                  <i class="fa fa-file-word-o"></i>
                </span>
                
                  <span class="post-meta-item-text">字数统计&#58;</span>
                
                <span title="字数统计">
                  2,035
                </span>
              

              
                <span class="post-meta-divider">|</span>
              

              
                <span class="post-meta-item-icon">
                  <i class="fa fa-clock-o"></i>
                </span>
                
                  <span class="post-meta-item-text">阅读时长 &asymp;</span>
                
                <span title="阅读时长">
                  10
                </span>
              
            </div>
          

          
          
        </div>
      </header>
    

    
    
    
    <div class="post-body" itemprop="articleBody">

      
      

      
        <h1 id="扩展运算符（-）"><a href="#扩展运算符（-）" class="headerlink" title="扩展运算符（...）"></a>扩展运算符（<code>...</code>）</h1><p>将数组变为参数序列</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">console.log(...[1,2,3]); // 1,2,3</span><br></pre></td></tr></table></figure>
<h2 id="代替apply"><a href="#代替apply" class="headerlink" title="代替apply"></a>代替apply</h2><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line">// ES5 的写法</span><br><span class="line">Math.max.apply(null, [14, 3, 77])</span><br><span class="line"></span><br><span class="line">// ES6 的写法</span><br><span class="line">Math.max(...[14, 3, 77])</span><br><span class="line"></span><br><span class="line">// 等同于</span><br><span class="line">Math.max(14, 3, 77);</span><br></pre></td></tr></table></figure>
<h2 id="替换push"><a href="#替换push" class="headerlink" title="替换push"></a>替换push</h2><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line">// ES5的 写法</span><br><span class="line">var arr1 = [0, 1, 2];</span><br><span class="line">var arr2 = [3, 4, 5];</span><br><span class="line">Array.prototype.push.apply(arr1, arr2);</span><br><span class="line"></span><br><span class="line">// ES6 的写法</span><br><span class="line">let arr1 = [0, 1, 2];</span><br><span class="line">let arr2 = [3, 4, 5];</span><br><span class="line">arr1.push(...arr2);</span><br></pre></td></tr></table></figure>
<h2 id="应用"><a href="#应用" class="headerlink" title="应用"></a>应用</h2><p><strong>复制数组</strong></p>
<p>单层数据数组可实现深拷贝，如果是数组对象无法实现深拷贝。</p>
<p><strong>合并数组</strong></p>
<p><strong>与解构赋值结合</strong></p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">const [first, ...rest] = [1, 2, 3, 4, 5];</span><br><span class="line">first // 1</span><br><span class="line">rest  // [2, 3, 4, 5]</span><br></pre></td></tr></table></figure>
<p><strong>字符串变为数组</strong></p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">[...&apos;hello&apos;]; // [ &quot;h&quot;, &quot;e&quot;, &quot;l&quot;, &quot;l&quot;, &quot;o&quot; ]</span><br></pre></td></tr></table></figure>
<p><strong>实现Iterator接口的对象</strong></p>
<p>任何定义了遍历器（Iterator）接口的对象都可以用扩展运算符转为真正的数组。</p>
<p>如<code>nodeList</code>、<code>Map</code>和<code>Set</code>、<code>Array</code>、<code>String</code>、<code>arguments</code>等。</p>
<h1 id="判断-1-2-是否为数组的方法"><a href="#判断-1-2-是否为数组的方法" class="headerlink" title="判断[1,2]是否为数组的方法"></a>判断[1,2]是否为数组的方法</h1><p><strong>typeof 不能验证[1,2]是否为数组，返回的是’object’</strong></p>
<h2 id="Array-isArray"><a href="#Array-isArray" class="headerlink" title="Array.isArray"></a>Array.isArray</h2><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Array.isArray([1,2]) // true</span><br></pre></td></tr></table></figure>
<h2 id="instanceof"><a href="#instanceof" class="headerlink" title="instanceof"></a>instanceof</h2><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">[1,2] instanceof Array</span><br></pre></td></tr></table></figure>
<p>来一下<code>instanceof</code>的具体实现方法</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line">function instanceof(left, right) &#123;</span><br><span class="line">    // 获得类型的原型</span><br><span class="line">    let prototype = right.prototype</span><br><span class="line">    // 获得对象的原型</span><br><span class="line">    left = left.__proto__</span><br><span class="line">    // 判断对象的类型是否等于类型的原型</span><br><span class="line">    while (true) &#123;</span><br><span class="line">        if (left === null)</span><br><span class="line">            return false</span><br><span class="line">        if (prototype === left)</span><br><span class="line">            return true</span><br><span class="line">        left = left.__proto__</span><br><span class="line">    &#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
<p>所以<code>[1,2].__proto__ === Array.prototype</code>也是可以验证是否为数组</p>
<h2 id="prototype"><a href="#prototype" class="headerlink" title="prototype"></a>prototype</h2><p>除了<code>[1,2].__proto__ === Array.prototype</code>之外，还有<code>Array.prototype.isPrototypeOf([1,2])</code></p>
<h2 id="constructor-NaN"><a href="#constructor-NaN" class="headerlink" title="constructor"></a>constructor</h2><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">[1,2].constructor === Array</span><br></pre></td></tr></table></figure>
<p>同上理</p>
<h2 id="apply、call、bind"><a href="#apply、call、bind" class="headerlink" title="apply、call、bind"></a>apply、call、bind</h2><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">(&#123;&#125;).toString.apply([1,2]) === &apos;[object Array]&apos;</span><br><span class="line">(&#123;&#125;).toString.call([1,2]) === &apos;[object Array]&apos;</span><br><span class="line">(&#123;&#125;).toString.bind([1,2])() === &apos;[object Array]&apos;</span><br></pre></td></tr></table></figure>
<h1 id="截取"><a href="#截取" class="headerlink" title="截取"></a>截取</h1><h2 id="slice"><a href="#slice" class="headerlink" title="slice"></a>slice</h2><p>截取数组一部分，并返回新数组，输入开始位置，结束位置</p>
<p><strong>不会改变原数组</strong></p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">var arr = [&apos;A&apos;, &apos;B&apos;, &apos;C&apos;, &apos;D&apos;, &apos;E&apos;, &apos;F&apos;, &apos;G&apos;];</span><br><span class="line">arr.slice(1,3);      //(2) [&quot;B&quot;, &quot;C&quot;]</span><br></pre></td></tr></table></figure>
<h2 id="splice"><a href="#splice" class="headerlink" title="splice"></a>splice</h2><p>从数组中添加或删除元素</p>
<p>开始位置，个数，添加数据</p>
<p><strong>会改变原数组</strong></p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">var arr = [&apos;A&apos;, &apos;B&apos;, &apos;C&apos;, &apos;D&apos;, &apos;E&apos;, &apos;F&apos;, &apos;G&apos;];</span><br><span class="line">arr.splice(1,3);     //(3) [&quot;B&quot;, &quot;C&quot;, &quot;D&quot;]</span><br></pre></td></tr></table></figure>
<h1 id="在开头或末尾增加或删除"><a href="#在开头或末尾增加或删除" class="headerlink" title="在开头或末尾增加或删除"></a>在开头或末尾增加或删除</h1><h2 id="push和pop"><a href="#push和pop" class="headerlink" title="push和pop"></a>push和pop</h2><p>push()向Array的末尾添加若干元素，pop()则把Array的最后一个元素删除掉.</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">var arr = [&apos;A&apos;, &apos;B&apos;, &apos;C&apos;, &apos;D&apos;, &apos;E&apos;, &apos;F&apos;, &apos;G&apos;];</span><br><span class="line">arr.push(&apos;h&apos;);       //[&apos;A&apos;, &apos;B&apos;, &apos;C&apos;, &apos;D&apos;, &apos;E&apos;, &apos;F&apos;, &apos;G&apos;,&apos;h&apos;];</span><br><span class="line">arr.pop();           //[&apos;A&apos;, &apos;B&apos;, &apos;C&apos;, &apos;D&apos;, &apos;E&apos;, &apos;F&apos;, &apos;G&apos;]</span><br></pre></td></tr></table></figure>
<h2 id="shift和unshift"><a href="#shift和unshift" class="headerlink" title="shift和unshift"></a>shift和unshift</h2><p>shift()删除数组第一个数据；<br>unshift()删除数姐最后一个数据。</p>
<h1 id="排序"><a href="#排序" class="headerlink" title="排序"></a>排序</h1><h2 id="sort"><a href="#sort" class="headerlink" title="sort"></a>sort</h2><p>按ascii码排序</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">var arr = [23,122,1,53,231]</span><br><span class="line">arr.sort();          //(5) [1, 122, 23, 231, 53]</span><br></pre></td></tr></table></figure>
<p>升序</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">var arr = [23,122,1,53,231];</span><br><span class="line">arr.sort((a,b) =&gt;  a - b); //[1, 23, 53, 122, 231]</span><br></pre></td></tr></table></figure>
<h2 id="reverse"><a href="#reverse" class="headerlink" title="reverse"></a>reverse</h2><p>倒序</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">var arr = [23,122,1,53,231]</span><br><span class="line">arr.reverse();       //(5) [53, 231, 23, 122, 1]</span><br></pre></td></tr></table></figure>
<h1 id="cancat"><a href="#cancat" class="headerlink" title="cancat"></a>cancat</h1><p>合并两个数组</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">var a = [&apos;a&apos;,&apos;b&apos;];</span><br><span class="line">var b = [&apos;c&apos;,&apos;d&apos;]</span><br><span class="line">var c = a.concat(b);</span><br><span class="line">c                  //(4) [&quot;a&quot;, &quot;b&quot;, &quot;c&quot;, &quot;d&quot;]</span><br></pre></td></tr></table></figure>
<h1 id="join"><a href="#join" class="headerlink" title="join"></a>join</h1><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">c.join(&apos;,&apos;);       //&quot;a,b,c,d&quot;</span><br></pre></td></tr></table></figure>
<h1 id="copyWithin"><a href="#copyWithin" class="headerlink" title="copyWithin"></a>copyWithin</h1><p>复制指定值（数组中的值）到指定位置</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">//  将 3 号位复制到 0 号位</span><br><span class="line">[1, 2, 3, 4, 5].copyWithin(0, 3, 4)</span><br><span class="line">// [4, 2, 3, 4, 5]</span><br></pre></td></tr></table></figure>
<h1 id="查询和过滤"><a href="#查询和过滤" class="headerlink" title="查询和过滤"></a>查询和过滤</h1><h2 id="entries"><a href="#entries" class="headerlink" title="entries"></a>entries</h2><p>返回迭代器，一般和<code>next</code>一起使用</p>
<p><code>[&#39;a&#39;, &#39;b&#39;, &#39;c&#39;].entries().next().value</code></p>
<h2 id="fromEntries"><a href="#fromEntries" class="headerlink" title="fromEntries"></a>fromEntries</h2><p>将键值对数组转为对象</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">const map = new Map().set(&apos;foo&apos;, true).set(&apos;bar&apos;, false);</span><br><span class="line">Object.fromEntries(map)</span><br></pre></td></tr></table></figure>
<h2 id="values"><a href="#values" class="headerlink" title="values"></a>values</h2><p>和entries异曲同工<br>返回迭代器，一般和<code>next</code>一起使用</p>
<p><code>[&#39;a&#39;, &#39;b&#39;, &#39;c&#39;].values().next().value</code></p>
<h2 id="keys"><a href="#keys" class="headerlink" title="keys"></a>keys</h2><p>数组里的下标</p>
<p><code>[...[&#39;a&#39;, &#39;b&#39;, &#39;c&#39;].keys()]</code></p>
<h2 id="every"><a href="#every" class="headerlink" title="every"></a>every</h2><p>检查数组的每个元素是否符合条件</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">function c(element,index,array)&#123;</span><br><span class="line">    return (element &gt; 10)</span><br><span class="line">&#125;</span><br><span class="line">[12, 54, 18, 130, 44].every(c)</span><br><span class="line">//true</span><br><span class="line">[12, 5, 8, 130, 44].every(c)</span><br><span class="line">//false</span><br></pre></td></tr></table></figure>
<h2 id="some"><a href="#some" class="headerlink" title="some"></a>some</h2><p>和every异曲同工<br><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">function c(element,index,array)&#123;</span><br><span class="line">    return (element &gt; 10)</span><br><span class="line">&#125;</span><br><span class="line">[12, 54, 18, 130, 44].some(c)</span><br><span class="line">//true</span><br><span class="line">[2, 5, 8, 3, 4].some(c)</span><br><span class="line">//false</span><br></pre></td></tr></table></figure></p>
<h2 id="filter"><a href="#filter" class="headerlink" title="filter"></a>filter</h2><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">[12, 5, 8, 130, 44].filter( num =&gt; num &gt;10)</span><br><span class="line">(3) [12, 130, 44]</span><br></pre></td></tr></table></figure>
<h2 id="indexOf"><a href="#indexOf" class="headerlink" title="indexOf"></a>indexOf</h2><p>与String类似，Array也可以通过indexOf()来搜索一个指定的元素的位置：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">var arr = [123,124,&apos;124&apos;];</span><br><span class="line">arr.indexOf(124);    //1</span><br></pre></td></tr></table></figure>
<p>注意了，数字124和字符串’124’是不同的元素。</p>
<h2 id="find和findIndex"><a href="#find和findIndex" class="headerlink" title="find和findIndex"></a>find和findIndex</h2><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">[12, 5, 8, 130, 44].find((ele)=&gt;&#123;return ele&gt;10&#125;)</span><br><span class="line">//12</span><br><span class="line">[12, 5, 8, 130, 44].findIndex((ele)=&gt;&#123;return ele&gt;20&#125;)</span><br><span class="line">//3</span><br></pre></td></tr></table></figure>
<h2 id="includes"><a href="#includes" class="headerlink" title="includes"></a>includes</h2><p>返回是否有这个值<br><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">[1,2,3].includes(2)</span><br><span class="line">//true</span><br></pre></td></tr></table></figure></p>
<h1 id="fill"><a href="#fill" class="headerlink" title="fill"></a>fill</h1><p>填充</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">var arr = new Array(8).fill(&apos;2&apos;); // [&quot;2&quot;, &quot;2&quot;, &quot;2&quot;, &quot;2&quot;, &quot;2&quot;, &quot;2&quot;, &quot;2&quot;, &quot;2&quot;]</span><br></pre></td></tr></table></figure>
<h1 id="用最短的代码实现一个长度为m-6-且值都n-8-的数组"><a href="#用最短的代码实现一个长度为m-6-且值都n-8-的数组" class="headerlink" title="用最短的代码实现一个长度为m(6)且值都n(8)的数组"></a>用最短的代码实现一个长度为m(6)且值都n(8)的数组</h1><p><code>Array(6).fill(&#39;8&#39;)</code></p>
<h1 id="of"><a href="#of" class="headerlink" title="of"></a>of</h1><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">new Array(3); // [empty × 3]</span><br><span class="line">Array.of(3); // [3]</span><br></pre></td></tr></table></figure>
<p>可用于回调函数生成数组。</p>
<h1 id="遍历"><a href="#遍历" class="headerlink" title="遍历"></a>遍历</h1><h2 id="map"><a href="#map" class="headerlink" title="map"></a>map</h2><p>遍历，<strong>返回新数据</strong>，对原数组不影响。</p>
<p>原来的写法：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">for(var i in list)&#123;</span><br><span class="line">    list[i].type = 1</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
<p>优化后：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><span class="line">var newList = list.map(item =&gt; &#123;</span><br><span class="line">    item.type = 1;</span><br><span class="line">    return item;</span><br><span class="line">&#125;)</span><br><span class="line"></span><br><span class="line">或</span><br><span class="line"></span><br><span class="line">list.map(item =&gt; &#123;</span><br><span class="line">    item.type = 1;</span><br><span class="line">&#125;)</span><br><span class="line">var newList = list;</span><br></pre></td></tr></table></figure>
<p>当数组是数字时：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">var arr = [4, 9, 16, 25];</span><br><span class="line">var brr = arr.map(val =&gt; val+1);</span><br><span class="line">brr; // [5, 10, 17, 26]</span><br><span class="line">arr; // [4, 9, 16, 25]</span><br></pre></td></tr></table></figure>
<p>当数组是对象时：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">var arr = [&#123;name:&apos;小明&apos;&#125;,&#123;name:&apos;小红&apos;&#125;];</span><br><span class="line">var brr = arr.map(val=&gt; val.sex = 1);</span><br><span class="line">var crr = arr.map(val =&gt; &#123;val.age = 18;return val&#125;);</span><br><span class="line">arr; // [&#123;name:&apos;小明&apos;, sex: 1, age: 18&#125;,&#123;name:&apos;小红&apos;, sex: 1, age: 18&#125;]</span><br><span class="line">brr; // [1, 1]</span><br><span class="line">crr; // [&#123;name:&apos;小明&apos;, sex: 1, age: 18&#125;,&#123;name:&apos;小红&apos;, sex: 1, age: 18&#125;]</span><br></pre></td></tr></table></figure>
<p>可以看到，arr原数组表面上是已经被改变的了，实际上是对象的引用，所以在map里面改变，会导致新值和旧值都改变。</p>
<p><strong>合并2个对象</strong><br><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line">var arr = [&#123;id:1,val: 3&#125;,&#123;id:2,val: 5&#125;,&#123;id:3,val:9&#125;];</span><br><span class="line">var brr = [&#123;id:1,val: 13&#125;,&#123;id:2,val: 15&#125;];</span><br><span class="line">arr.map( v =&gt; &#123;</span><br><span class="line">    brr.map( b =&gt; &#123;</span><br><span class="line">        if(v.id == b.id) &#123;</span><br><span class="line">            v.val = b.val;</span><br><span class="line">        &#125;</span><br><span class="line">    &#125;)</span><br><span class="line">    return v;</span><br><span class="line">&#125;)</span><br></pre></td></tr></table></figure></p>
<h2 id="forEach"><a href="#forEach" class="headerlink" title="forEach"></a>forEach</h2><p>遍历，每个元素执行回调函数，<strong>返回undefined</strong>。</p>
<h2 id="reduce"><a href="#reduce" class="headerlink" title="reduce"></a>reduce</h2><p>将数组计算为一个值</p>
<p>原来写法：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">var numbers = [15.5, 2.3, 1.1, 4.7];</span><br><span class="line">let total = 0;</span><br><span class="line">numbers.forEach(val =&gt; &#123;</span><br><span class="line">    total += val;</span><br><span class="line">&#125;)</span><br><span class="line">console.log(total); // 23.6</span><br></pre></td></tr></table></figure>
<p>reduce写法：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">var numbers = [15.5, 2.3, 1.1, 4.7];</span><br><span class="line"></span><br><span class="line">function getSum(total, num) &#123;</span><br><span class="line">    return total + num;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line">console.log(getSum,0); // 23.6</span><br></pre></td></tr></table></figure>
<p>或：<br><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">[15.5, 2.3, 1.1, 4.7].reduce((x,y) =&gt; x+y) // 23.6</span><br></pre></td></tr></table></figure></p>
<p>reduce计算数组对象的和：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">var arr = [&#123;id:1,num:3&#125;,&#123;id:2,num:5&#125;,&#123;id:5,num: 8&#125;];</span><br><span class="line">var total = arr.reduce((total,next) =&gt;&#123;</span><br><span class="line">    return total + next.num;</span><br><span class="line">&#125;,0)</span><br><span class="line">total; // 16</span><br></pre></td></tr></table></figure>
<h1 id="toLocalString"><a href="#toLocalString" class="headerlink" title="toLocalString"></a>toLocalString</h1><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">arr.toLocaleString()</span><br><span class="line">&quot;1,2,3,4,5&quot;</span><br></pre></td></tr></table></figure>
<h1 id="from"><a href="#from" class="headerlink" title="from"></a>from</h1><h2 id="将类数组对象或可遍历对象变成真正的对象。"><a href="#将类数组对象或可遍历对象变成真正的对象。" class="headerlink" title="将类数组对象或可遍历对象变成真正的对象。"></a>将类数组对象或可遍历对象变成真正的对象。</h2><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line">let arrayLike = &#123;</span><br><span class="line">0: &apos;tom&apos;,</span><br><span class="line">1: &apos;65&apos;,</span><br><span class="line">2: &apos;男&apos;,</span><br><span class="line">3: [&apos;jane&apos;,&apos;john&apos;,&apos;Mary&apos;],</span><br><span class="line">&apos;length&apos;: 4</span><br><span class="line">&#125;</span><br><span class="line">let arr = Array.from(arrayLike)</span><br><span class="line">console.log(arr) // [&apos;tom&apos;,&apos;65&apos;,&apos;男&apos;,[&apos;jane&apos;,&apos;john&apos;,&apos;Mary&apos;]]</span><br></pre></td></tr></table></figure>
<p>同扩展运算符一样，只要是部署了 Iterator 接口的数据结构，Array.from都能将其转为数组。区别在于<code>Array.from</code>还能转换类数组对象。</p>
<p>比如该类数组对象就只能用<code>Array.from</code>转换成数组，不能用<code>扩展运算符</code>转换。</p>
<p>其它情况则不会改变，会变成<code>[ undefined, undefined, undefined, undefined ]</code>。</p>
<h2 id="Set变为数组"><a href="#Set变为数组" class="headerlink" title="Set变为数组"></a>Set变为数组</h2><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Array.from(new Set([1,3,3,4])) //[1, 3, 4]</span><br></pre></td></tr></table></figure>
<p>还能带参数</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Array.from(new Set([1,3,3,4]), item =&gt; item + 1) //[2, 4, 5]</span><br></pre></td></tr></table></figure>
<h2 id="字符串变为数组"><a href="#字符串变为数组" class="headerlink" title="字符串变为数组"></a>字符串变为数组</h2><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Array.from(&apos;hello&apos;) // [&quot;h&quot;, &quot;e&quot;, &quot;l&quot;, &quot;l&quot;, &quot;o&quot;]</span><br></pre></td></tr></table></figure>
<h1 id="flat-和flatMap"><a href="#flat-和flatMap" class="headerlink" title="flat()和flatMap()"></a><code>flat()</code>和<code>flatMap()</code></h1><p><a href="https://blog.csdn.net/qq_29055201/article/details/86530254" target="_blank" rel="noopener">学习链接</a></p>
<h2 id="flat"><a href="#flat" class="headerlink" title="flat"></a>flat</h2><p>拉平数组，默认一层，填几就拉平几层嵌套，如果想拉平所有的，用<code>Infinity</code></p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">[1, 2, [3, [4, 5]]].flat()</span><br><span class="line">// [1, 2, 3, [4, 5]]</span><br><span class="line">[1, 2, [3, [4, 5]]].flat(2)</span><br><span class="line">// [1, 2, 3, 4, 5]</span><br><span class="line">[1, [2, [3]]].flat(Infinity)</span><br><span class="line">// [1, 2, 3]</span><br></pre></td></tr></table></figure>
<h2 id="flatMap"><a href="#flatMap" class="headerlink" title="flatMap"></a>flatMap</h2><p>与map类似，不同的是可以拉平数组，但只能拉平一层，不能多层。</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">[1,[2,[3],4,5],6,[7],8].flatMap(v =&gt; v*2)</span><br><span class="line">(5) [2, NaN, 12, 14, 16]</span><br></pre></td></tr></table></figure>
<h1 id="取出数组中最大的数值"><a href="#取出数组中最大的数值" class="headerlink" title="取出数组中最大的数值"></a>取出数组中最大的数值</h1><p><code>Math.max(...[14, 3, 77])</code></p>
<h1 id="arguments参数的3种转数组方法"><a href="#arguments参数的3种转数组方法" class="headerlink" title="arguments参数的3种转数组方法"></a><code>arguments</code>参数的3种转数组方法</h1><p><strong>方法1：Array.prototype.slice.apply</strong><br><strong>方法2：Array.from</strong><br><strong>方法3：[…arguments]</strong></p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line">var test3 = function()&#123;</span><br><span class="line">    console.log(arguments);</span><br><span class="line">    var list1 = Array.prototype.slice.apply(arguments);</span><br><span class="line">    console.log(list1);</span><br><span class="line">    var list2 = Array.from(arguments);</span><br><span class="line">    console.log(list2);</span><br><span class="line">    var list3 = [...arguments];</span><br><span class="line">    console.log(list3);</span><br><span class="line">&#125;</span><br><span class="line">test3(1,2,3,4);</span><br></pre></td></tr></table></figure>
<p><img src="https://wx2.sinaimg.cn/mw690/0069qZtTgy1ghdl1udru0j309o068dfy.jpg" alt="image"></p>
<h1 id="forEach跳出循环"><a href="#forEach跳出循环" class="headerlink" title="forEach跳出循环"></a>forEach跳出循环</h1><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line">var BreakException= &#123;&#125;;</span><br><span class="line"></span><br><span class="line">try &#123;</span><br><span class="line">    [1,2,3].forEach(function(i) &#123;</span><br><span class="line">        if(i === 2) throw BreakException;</span><br><span class="line">        console.log(i);</span><br><span class="line">    &#125;);</span><br><span class="line">&#125; catch(e) &#123;</span><br><span class="line">    if (e!==BreakException) throw e;</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line">//forEach是函数，不是语法，因此没有直接break的语法。如果要中止，可使用 Array.every 或 Array.some。</span><br></pre></td></tr></table></figure>

      
    </div>
    
    
    

    

    

    

    <footer class="post-footer">
      

      
      
      

      
        <div class="post-nav">
          <div class="post-nav-next post-nav-item">
            
              <a href="/2020/06/05/JavaScript之String对象/" rel="next" title="JavaScript之String对象">
                <i class="fa fa-chevron-left"></i> JavaScript之String对象
              </a>
            
          </div>

          <span class="post-nav-divider"></span>

          <div class="post-nav-prev post-nav-item">
            
              <a href="/2020/06/08/《围城》/" rel="prev" title="《围城》">
                《围城》 <i class="fa fa-chevron-right"></i>
              </a>
            
          </div>
        </div>
      

      
      
    </footer>
  </div>
  
  
  
  </article>



    <div class="post-spread">
      
    </div>
  </div>


          </div>
          


          

  
    <div class="comments" id="comments">
      <div id="lv-container" data-id="city" data-uid="MTAyMC8zODk2OC8xNTQ5Ng=="></div>
    </div>

  



        </div>
        
          
  
  <div class="sidebar-toggle">
    <div class="sidebar-toggle-line-wrap">
      <span class="sidebar-toggle-line sidebar-toggle-line-first"></span>
      <span class="sidebar-toggle-line sidebar-toggle-line-middle"></span>
      <span class="sidebar-toggle-line sidebar-toggle-line-last"></span>
    </div>
  </div>

  <aside id="sidebar" class="sidebar">
    
    <div class="sidebar-inner">

      

      
        <ul class="sidebar-nav motion-element">
          <li class="sidebar-nav-toc sidebar-nav-active" data-target="post-toc-wrap">
            文章目录
          </li>
          <li class="sidebar-nav-overview" data-target="site-overview-wrap">
            站点概览
          </li>
        </ul>
      

      <section class="site-overview-wrap sidebar-panel">
        <div class="site-overview">
          <div class="site-author motion-element" itemprop="author" itemscope itemtype="http://schema.org/Person">
            
              <img class="site-author-image" itemprop="image" src="https://upload.jianshu.io/users/upload_avatars/830956/debe5156eed7?imageMogr2/auto-orient/strip|imageView2/1/w/240/h/240" alt="彭丹丹">
            
              <p class="site-author-name" itemprop="name">彭丹丹</p>
              <p class="site-description motion-element" itemprop="description"></p>
          </div>

          <nav class="site-state motion-element">

            
              <div class="site-state-item site-state-posts">
              
                <a href="/archives">
              
                  <span class="site-state-item-count">183</span>
                  <span class="site-state-item-name">日志</span>
                </a>
              </div>
            

            
              
              
              <div class="site-state-item site-state-categories">
                <a href="/categories/index.html">
                  <span class="site-state-item-count">3</span>
                  <span class="site-state-item-name">分类</span>
                </a>
              </div>
            

            

          </nav>

          

          

          
          

          
          

          

        </div>
      </section>

      
      <!--noindex-->
        <section class="post-toc-wrap motion-element sidebar-panel sidebar-panel-active">
          <div class="post-toc">

            
              
            

            
              <div class="post-toc-content"><ol class="nav"><li class="nav-item nav-level-1"><a class="nav-link" href="#扩展运算符（-）"><span class="nav-number">1.</span> <span class="nav-text">扩展运算符（...）</span></a><ol class="nav-child"><li class="nav-item nav-level-2"><a class="nav-link" href="#代替apply"><span class="nav-number">1.1.</span> <span class="nav-text">代替apply</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#替换push"><span class="nav-number">1.2.</span> <span class="nav-text">替换push</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#应用"><span class="nav-number">1.3.</span> <span class="nav-text">应用</span></a></li></ol></li><li class="nav-item nav-level-1"><a class="nav-link" href="#判断-1-2-是否为数组的方法"><span class="nav-number">2.</span> <span class="nav-text">判断[1,2]是否为数组的方法</span></a><ol class="nav-child"><li class="nav-item nav-level-2"><a class="nav-link" href="#Array-isArray"><span class="nav-number">2.1.</span> <span class="nav-text">Array.isArray</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#instanceof"><span class="nav-number">2.2.</span> <span class="nav-text">instanceof</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#prototype"><span class="nav-number">2.3.</span> <span class="nav-text">prototype</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#constructor-NaN"><span class="nav-number">2.4.</span> <span class="nav-text">constructor</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#apply、call、bind"><span class="nav-number">2.5.</span> <span class="nav-text">apply、call、bind</span></a></li></ol></li><li class="nav-item nav-level-1"><a class="nav-link" href="#截取"><span class="nav-number">3.</span> <span class="nav-text">截取</span></a><ol class="nav-child"><li class="nav-item nav-level-2"><a class="nav-link" href="#slice"><span class="nav-number">3.1.</span> <span class="nav-text">slice</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#splice"><span class="nav-number">3.2.</span> <span class="nav-text">splice</span></a></li></ol></li><li class="nav-item nav-level-1"><a class="nav-link" href="#在开头或末尾增加或删除"><span class="nav-number">4.</span> <span class="nav-text">在开头或末尾增加或删除</span></a><ol class="nav-child"><li class="nav-item nav-level-2"><a class="nav-link" href="#push和pop"><span class="nav-number">4.1.</span> <span class="nav-text">push和pop</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#shift和unshift"><span class="nav-number">4.2.</span> <span class="nav-text">shift和unshift</span></a></li></ol></li><li class="nav-item nav-level-1"><a class="nav-link" href="#排序"><span class="nav-number">5.</span> <span class="nav-text">排序</span></a><ol class="nav-child"><li class="nav-item nav-level-2"><a class="nav-link" href="#sort"><span class="nav-number">5.1.</span> <span class="nav-text">sort</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#reverse"><span class="nav-number">5.2.</span> <span class="nav-text">reverse</span></a></li></ol></li><li class="nav-item nav-level-1"><a class="nav-link" href="#cancat"><span class="nav-number">6.</span> <span class="nav-text">cancat</span></a></li><li class="nav-item nav-level-1"><a class="nav-link" href="#join"><span class="nav-number">7.</span> <span class="nav-text">join</span></a></li><li class="nav-item nav-level-1"><a class="nav-link" href="#copyWithin"><span class="nav-number">8.</span> <span class="nav-text">copyWithin</span></a></li><li class="nav-item nav-level-1"><a class="nav-link" href="#查询和过滤"><span class="nav-number">9.</span> <span class="nav-text">查询和过滤</span></a><ol class="nav-child"><li class="nav-item nav-level-2"><a class="nav-link" href="#entries"><span class="nav-number">9.1.</span> <span class="nav-text">entries</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#fromEntries"><span class="nav-number">9.2.</span> <span class="nav-text">fromEntries</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#values"><span class="nav-number">9.3.</span> <span class="nav-text">values</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#keys"><span class="nav-number">9.4.</span> <span class="nav-text">keys</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#every"><span class="nav-number">9.5.</span> <span class="nav-text">every</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#some"><span class="nav-number">9.6.</span> <span class="nav-text">some</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#filter"><span class="nav-number">9.7.</span> <span class="nav-text">filter</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#indexOf"><span class="nav-number">9.8.</span> <span class="nav-text">indexOf</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#find和findIndex"><span class="nav-number">9.9.</span> <span class="nav-text">find和findIndex</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#includes"><span class="nav-number">9.10.</span> <span class="nav-text">includes</span></a></li></ol></li><li class="nav-item nav-level-1"><a class="nav-link" href="#fill"><span class="nav-number">10.</span> <span class="nav-text">fill</span></a></li><li class="nav-item nav-level-1"><a class="nav-link" href="#用最短的代码实现一个长度为m-6-且值都n-8-的数组"><span class="nav-number">11.</span> <span class="nav-text">用最短的代码实现一个长度为m(6)且值都n(8)的数组</span></a></li><li class="nav-item nav-level-1"><a class="nav-link" href="#of"><span class="nav-number">12.</span> <span class="nav-text">of</span></a></li><li class="nav-item nav-level-1"><a class="nav-link" href="#遍历"><span class="nav-number">13.</span> <span class="nav-text">遍历</span></a><ol class="nav-child"><li class="nav-item nav-level-2"><a class="nav-link" href="#map"><span class="nav-number">13.1.</span> <span class="nav-text">map</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#forEach"><span class="nav-number">13.2.</span> <span class="nav-text">forEach</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#reduce"><span class="nav-number">13.3.</span> <span class="nav-text">reduce</span></a></li></ol></li><li class="nav-item nav-level-1"><a class="nav-link" href="#toLocalString"><span class="nav-number">14.</span> <span class="nav-text">toLocalString</span></a></li><li class="nav-item nav-level-1"><a class="nav-link" href="#from"><span class="nav-number">15.</span> <span class="nav-text">from</span></a><ol class="nav-child"><li class="nav-item nav-level-2"><a class="nav-link" href="#将类数组对象或可遍历对象变成真正的对象。"><span class="nav-number">15.1.</span> <span class="nav-text">将类数组对象或可遍历对象变成真正的对象。</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#Set变为数组"><span class="nav-number">15.2.</span> <span class="nav-text">Set变为数组</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#字符串变为数组"><span class="nav-number">15.3.</span> <span class="nav-text">字符串变为数组</span></a></li></ol></li><li class="nav-item nav-level-1"><a class="nav-link" href="#flat-和flatMap"><span class="nav-number">16.</span> <span class="nav-text">flat()和flatMap()</span></a><ol class="nav-child"><li class="nav-item nav-level-2"><a class="nav-link" href="#flat"><span class="nav-number">16.1.</span> <span class="nav-text">flat</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#flatMap"><span class="nav-number">16.2.</span> <span class="nav-text">flatMap</span></a></li></ol></li><li class="nav-item nav-level-1"><a class="nav-link" href="#取出数组中最大的数值"><span class="nav-number">17.</span> <span class="nav-text">取出数组中最大的数值</span></a></li><li class="nav-item nav-level-1"><a class="nav-link" href="#arguments参数的3种转数组方法"><span class="nav-number">18.</span> <span class="nav-text">arguments参数的3种转数组方法</span></a></li><li class="nav-item nav-level-1"><a class="nav-link" href="#forEach跳出循环"><span class="nav-number">19.</span> <span class="nav-text">forEach跳出循环</span></a></li></ol></div>
            

          </div>
        </section>
      <!--/noindex-->
      

      

    </div>
  </aside>


        
      </div>
    </main>

    <footer id="footer" class="footer">
      <div class="footer-inner">
        <script async src="https://dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js"></script>
<div class="copyright">&copy; <span itemprop="copyrightYear">2020</span>
  <span class="with-love">
    <i class="fa fa-user"></i>
  </span>
  <span class="author" itemprop="copyrightHolder">彭丹丹</span>

  
</div>


	<div class="powered-by">
	<i class="fa fa-user-md"></i><span id="busuanzi_container_site_uv">
	  本站访客数:<span id="busuanzi_value_site_uv"></span>
	</span>
	</div>
  <div class="powered-by">由 <a class="theme-link" target="_blank" href="https://hexo.io">Hexo</a> 强力驱动</div>



  <span class="post-meta-divider">|</span>



  <div class="theme-info">主题 &mdash; <a class="theme-link" target="_blank" href="https://github.com/iissnan/hexo-theme-next">NexT.Pisces</a> v5.1.4</div>




        







        
      </div>
    </footer>

    
      <div class="back-to-top">
        <i class="fa fa-arrow-up"></i>
        
      </div>
    

    

  </div>

  

<script type="text/javascript">
  if (Object.prototype.toString.call(window.Promise) !== '[object Function]') {
    window.Promise = null;
  }
</script>









  












  
  
    <script type="text/javascript" src="/lib/jquery/index.js?v=2.1.3"></script>
  

  
  
    <script type="text/javascript" src="/lib/fastclick/lib/fastclick.min.js?v=1.0.6"></script>
  

  
  
    <script type="text/javascript" src="/lib/jquery_lazyload/jquery.lazyload.js?v=1.9.7"></script>
  

  
  
    <script type="text/javascript" src="/lib/velocity/velocity.min.js?v=1.2.1"></script>
  

  
  
    <script type="text/javascript" src="/lib/velocity/velocity.ui.min.js?v=1.2.1"></script>
  

  
  
    <script type="text/javascript" src="/lib/fancybox/source/jquery.fancybox.pack.js?v=2.1.5"></script>
  


  


  <script type="text/javascript" src="/js/src/utils.js?v=5.1.4"></script>

  <script type="text/javascript" src="/js/src/motion.js?v=5.1.4"></script>



  
  


  <script type="text/javascript" src="/js/src/affix.js?v=5.1.4"></script>

  <script type="text/javascript" src="/js/src/schemes/pisces.js?v=5.1.4"></script>



  
  <script type="text/javascript" src="/js/src/scrollspy.js?v=5.1.4"></script>
<script type="text/javascript" src="/js/src/post-details.js?v=5.1.4"></script>



  


  <script type="text/javascript" src="/js/src/bootstrap.js?v=5.1.4"></script>



  


  




	





  





  
    <script type="text/javascript">
      (function(d, s) {
        var j, e = d.getElementsByTagName(s)[0];
        if (typeof LivereTower === 'function') { return; }
        j = d.createElement(s);
        j.src = 'https://cdn-city.livere.com/js/embed.dist.js';
        j.async = true;
        e.parentNode.insertBefore(j, e);
      })(document, 'script');
    </script>
  












  





  

  

  

  
  

  

  

  

  undefined
  
  <!-- 页面爆炸效果 -->
  
<script src="/live2dw/lib/L2Dwidget.min.js?0c58a1486de42ac6cc1c59c7d98ae887"></script><script>L2Dwidget.init({"pluginRootPath":"live2dw/","pluginJsPath":"lib/","pluginModelPath":"assets/","tagMode":false,"debug":false,"model":{"jsonPath":"/live2dw/assets/tororo.model.json"},"display":{"position":"right","width":150,"height":300},"mobile":{"show":true}});</script></body>
</html>
